<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>小米账号 - 注册</title>
    <!--图标-->
    <link href="#" rel="shortcut icon"/>
    <!--导入css样式-->
    <link rel="stylesheet" href="css/milogin.css" />
</head>
<body>
<!--登录界面是一个大容器-->
<div class="container">
    <div class="row">
        <div class="wrapper">
            <!--头部logo部分-->
            <div class="header">
                <div class="header_logo">
                    <a href="#">
                        <img src="img/mistore_logo.png" />
                    </a>
                </div>

            </div>
            <!--登录部分-->
            <div class="login_main">
                <div class="login_d1">
                    <!--登录主题部分-->
                    <div class="main_box">
                        <!--登录方式 - 账号登录 - 二维码登录-->
                        <div class="login_way">
                            <span><a href="#" class="zh_login">账号注册</a></span>
                            <span class="line">|</span>
                            <span><a href="#" class="ew_login">扫码注册</a></span>
                        </div>
                        <!--三种具体登录方式的容器-->
                        <div class="main_way">
                            <!--第一种登录方式-->
                            <div class="type typeOne">
                                <!--两个输入框-->
                                <form class="form_One">
                                    <!--Input  输入框 placeholder:输入框的提示信息 -->
                                    <input id="userName" placeholder="邮箱/手机号码/小米ID" />
                                    <input id="password" placeholder="密码" />
                                </form>
                                <!--提示输入-->
                                <div class="ts_string">
                                    <span>!</span>请输入账号
                                </div>
                                <!--登录按钮-->
                                <a class="subbutton">注册</a>

                                <!--手机短信登录-->
                                <div class="sj_way">
                                    <div class="dx_login"><a href="#">手机短信登录/注册</a></div>
                                    <div class="zc_wj">
                                        <span><a href="login.html">立即登录</a></span>
                                        <span class="line">|</span>
                                        <span><a href="#">忘记密码？</a></span>
                                    </div>
                                </div>
                                <!--其他登录方式-->
                                <div class="other_way_login">
                                    <!--文字和线条-->
                                    <!--fieldset：主要用于表单框的样式-->
                                    <fieldset class="fie">
                                        <!--legend:主要表示标签的对齐方式-->
                                        <legend><a href="#">其他登录方式</a></legend>
                                    </fieldset>
                                    <!--第三方登录的图片-->
                                    <div class="other_qq">
                                        <a href="#"><img src="img/qq.png"/></a>
                                        <a href="#"><img src="img/weixin.png"/></a>
                                        <a href="#"><img src="img/xinlang.png"/></a>
                                        <a href="#"><img src="img/zhifubao.png"/></a>
                                    </div>

                                </div>


                            </div>
                            <div class="type typeTwo">
                                <img src="img/下载.png"/>
                                <div class="st_01">使用<span>小米商城APP</span>扫一扫</div>
                                <div class="st_02">小米手机可打开「设置」>「小米帐号」扫码登录</div>


                            </div>
                            <div class="type typeThree"></div>

                        </div>

                    </div>

                </div>

            </div>
            <!--其他信息部分-->
            <div class="ohter"></div>

        </div>
    </div>
</div>

</body>
<script type="text/javascript" src="js/jquery-3.5.0.js" ></script>
<script type="text/javascript" src="js/milogin.js" ></script>
<script type="text/javascript" src="js/http.js" ></script>
<script>


    $(".subbutton").click(function(){

        httpRegister();
    });





    function httpRegister() {
        let userNameVal = $("#userName").val();
        let passwordVal = $("#password").val();

        let paramUser = {
            userName:userNameVal,
            password:passwordVal
        }

        httpPostWithParams("/register", paramUser, loginSuccess);

        function loginSuccess(user) {
            //获取返回用户信息
            let dbUser = user;
            //用户信息转换为json字符串
            let dbUserJson = JSON.stringify(dbUser);
            //存储用户信息到浏览器缓存(只能存储字符串)
            localStorage.setItem("userInfo", dbUserJson);
            //注册成功：跳转到首页
            window.alert("注册成功，即将跳转到首页");
            location.href = "index1.html";
        }
    }
</script>
</html>